// packageK/components/time-range/time-range.js
const dayjs = require("../../lib/dayjs.min")
Component({

  /**
   * 取消样式隔离
   */
  options: {
    styleIsolation: "shared"
  },

  /**
   * 组件的属性列表
   */
  properties: {

  },

  /**
   * 组件的初始数据
   */
  data: {
    startDate: '',
    endDate: '',
    datePickerShow: false,
    minDate: new Date().getTime(),
    maxDate: new Date().getTime(),
    currentDate: new Date().getTime(),
    formatter(type, value) {
      if (type === 'year') {
        return `${value}年`;
      }
      if (type === 'month') {
        return `${value}月`;
      }
      if (type === 'day') {
        return `${value}日`;
      }
      return value;
    },
    dropOption: [
      { text: '今日', value: 0 },
      { text: '本周', value: 1 },
      { text: '本月', value: 2 },
    ],
    dropValue: 0
  },

  /**
   * 组件的方法列表
   */
  methods: {
    /**
     * 显示时间选择
     * @param {Object} e 
     */
    showDatePicker: function(e) {
      const { dateType } = e.currentTarget.dataset
      this.setDatetRange(dateType)
      this.setData({
        currentDateType: dateType,
        datePickerShow: true
      })
    },

    /**
     * 隐藏时间选择
     */
    hideDatePicker: function () {
      this.setData({
        datePickerShow: false
      })
    },

    /**
     * 设置日期范围
     * @param {String} dateType 开始/结束日期
     */
    setDatetRange: function(dateType = '') {
      if (!dateType) {
        return
      }
      const today = new Date()
      const { startDate, endDate } = this.data
      let min = null
      let max = null
      // 开始时间范围
      if (dateType == 'start') {
        max = new Date(endDate).getTime()
        this.setData({ currentDate: new Date(startDate).getTime() })
      } else if(dateType == 'end') {
        min = new Date(startDate).getTime() + 86400000 - 1
        max = today.getTime()
        this.setData({ currentDate: new Date(endDate).getTime() })
      }
      this.setData({
        minDate: min,
        maxDate: max
      })
    },

    /**
     * 时间选择确定
     * @param {Object} e 
     */
    pickerConfirm: function(e) {
      const timeStamp = e.detail
      const inputValue = dayjs(timeStamp).format('YYYY/MM/DD')
      const bar = this.data.currentDateType == 'end' ? 'endDate' : 'startDate'
      this.setData({
        [bar]: inputValue
      })
      this.hideDatePicker()
      this.getChartData()
    },

    /**
     * 隐藏动作面板
     * @param {Object} e 
     */
    hideActionSheet: function(e) {
      const type = e.currentTarget.dataset.sheetType
      this.setData({
        [type]: false
      })
    },

    /** */
    dropChange: function(e) {
      const { detail } = e
      const today = dayjs()
      let start = ''
      if (detail == 0) {
        start = today
      } else if(detail == 1) {
        start = today.startOf('week').add(1, 'day')
      } else if(detail == 2) {
        start = today.startOf('month')
      }
      this.setData({
        startDate: start.format("YYYY/MM/DD"),
        endDate: today.format("YYYY/MM/DD")
      })
      this.getChartData()
    },

    /**
     * 触发事件，更新图表数据
     */
    getChartData: function() {
      const { startDate, endDate } = this.data
      this.triggerEvent('getChartData', { startDate, endDate })
    },
    
  },

  lifetimes: {
    ready: function() {
      const today = dayjs().format('YYYY/MM/DD')
      this.setData({
        startDate: today,
        endDate: today
      })
      this.getChartData()
    }
  }
})